<template>
    <view class="wo-page u-padding-20">
        <view class="wo-page-body u-padding-20">
            <data-form :form-model="unitDetail" :form-config="unitFieldConfig" ref="unitFieldConfig"></data-form>
            <view class="wo-panel-foot u-padding-top-20"><u-button type="success" shape="circle" @click="unitSubmitFunc">提交</u-button></view>
        </view>
        <u-toast ref="uToast" />
    </view>
</template>

<script>
import DataForm from '@/components/data-form';
export default {
    data() {
        return {
            wxUserDetail: {},
            unitDetail: {
                name: '',
                id_number: '',
                type_id: 0,
                area_id: 0,
                address: '',
                phone: '',
                sms_code: ''
            },
            unitFieldConfig: {
                name: {
                    field: 'name',
                    label: '单位名称',
                    form_show: true,
                    form_type: 'input-text',
                    form_placeholder: '请输入单位/组织/机构名称'
                },
                person_total: {
                    field: 'person_total',
                    label: '登记人数',
                    form_show: true,
                    form_type: 'input-number',
                    form_placeholder: '请输入登记人数'
                },
                type_id: {
                    field: 'type_id',
                    label: '行业类别',
                    async initFunc(viewModel) {
                        // 获取区域选择数据
                        let typeData = await viewModel.$u.api.typeSelectData();
                        if (!typeData) {
                            return false;
                        }
                        this.form_select_option = typeData;
                        this.resultFunc(viewModel.personDetail);
                        this.valueFunc(viewModel.personDetail);
                    },
                    // 结果处理
                    resultFunc(formModel) {
                        if (formModel[this.field]) {
                            for (let index in this.form_select_option) {
                                if (this.form_select_option[index].value == formModel[this.field]) {
                                    this.form_result = this.form_select_option[index].label;
                                    break;
                                }
                            }
                        }
                    },
                    // 赋值处理
                    valueFunc(formModel) {
                        // 选中处理
                        for (let index in this.form_select_option) {
                            if (this.form_select_option[index].value == formModel[this.field]) {
                                this.form_value[0] = parseInt(index);
                                break;
                            }
                        }
                    },
                    form_show: true,
                    form_type: 'select-single-column',
                    form_placeholder: '请选择行业类别',
                    form_select_option: [],
                    // 打开选择器
                    form_select_open: false,
                    // 选择结果
                    form_result: '',
                    // 选择值
                    form_value: [0],
                    form_select_confirm(event, formModel) {
                        // 数据赋值
                        formModel[this.field] = event[0].value;
                        this.resultFunc(formModel);
                        this.valueFunc(formModel);
                    }
                },
                area_id: {
                    field: 'area_id',
                    label: '所属社区',
                    // 初始化
                    async initFunc(viewModel) {
                        // 获取区域选择数据
                        let areaData = await viewModel.$u.api.areaSelectData();
                        if (!areaData) {
                            return false;
                        }
                        this.form_select_option = areaData;
                        this.resultFunc(viewModel.unitDetail);
                        this.valueFunc(viewModel.unitDetail);
                    },
                    // 结果处理
                    resultFunc(formModel) {
                        for (let index in this.form_select_option) {
                            if (this.form_select_option[index].value == formModel[this.field]) {
                                this.form_result = this.form_select_option[index].label;
                                break;
                            }
                            for (let _index in this.form_select_option[index].children) {
                                if (this.form_select_option[index].children[_index].value == formModel[this.field]) {
                                    this.form_result = this.form_select_option[index].label + ',' + this.form_select_option[index].children[_index].label;
                                    break;
                                }
                            }
                        }
                    },
                    // 赋值处理
                    valueFunc(formModel) {
                        // 选中处理
                        for (let index in this.form_select_option) {
                            if (this.form_select_option[index].value == formModel[this.field]) {
                                this.form_value[0] = parseInt(index);
                                this.form_value[1] = 0;
                                break;
                            }
                            for (let _index in this.form_select_option[index].children) {
                                if (this.form_select_option[index].children[_index].value == formModel[this.field]) {
                                    this.form_value[0] = parseInt(index);
                                    this.form_value[1] = parseInt(_index);
                                    break;
                                }
                            }
                        }
                    },
                    form_show: true,
                    form_type: 'select-muitl-column-auto',
                    form_placeholder: '请选择所属区域',
                    form_select_option: [],
                    // 打开选择器
                    form_select_open: false,
                    // 选择结果
                    form_result: '',
                    // 选择值
                    form_value: [0, 0],
                    form_select_confirm(event, formModel) {
                        formModel[this.field] = event[1].value || event[0].value;
                        // 展示处理
                        this.resultFunc(formModel);
                        // 值处理
                        this.valueFunc(formModel);
                    }
                },
                address: {
                    field: 'address',
                    label: '单位地址',
                    form_show: true,
                    form_type: 'input-text',
                    form_placeholder: '请输入办公地址门牌号'
                },
                person: {
                    field: 'person',
                    label: '对接联系',
                    form_show: true,
                    form_type: 'input-text',
                    form_placeholder: '请输入联系人姓名'
                },
                id_number: {
                    field: 'id_number',
                    label: '身份证号',
                    form_show: true,
                    form_type: 'input-text',
                    form_placeholder: '请输入联系人身份证号码'
                },
                phone: {
                    field: 'phone',
                    label: '手机号码',
                    form_show: true,
                    form_type: 'input-number',
                    form_placeholder: '请输入手机号码'
                },
                sms_code: {
                    field: 'sms_code',
                    label: '验证码',
                    form_show: true,
                    form_type: 'input-sms-code',
                    form_placeholder: '请输入短信验证码',
                    form_phone: 'phone',
                    form_action: 'unit'
                }
            }
        };
    },
    components: {
        DataForm
    },
    methods: {
        // 页面初始化
        async initPageFunc(option) {
            // 获取用户信息
            if (this.vuex_wx_token) {
                let wxUserDetail = await this.$u.api.wxUserDetail();
                if (wxUserDetail) {
                    this.wxUserDetail = wxUserDetail;
                }
            }
            // 字段初始化
            for (let field in this.unitFieldConfig) {
                if (this.unitFieldConfig[field].hasOwnProperty('initFunc')) {
                    this.unitFieldConfig[field].initFunc(this);
                }
            }
            this.pageInit = true;
        },
        async unitSubmitFunc() {
            let result = await this.$u.api.planUnitCreate(this.unitDetail);
            if (!result) {
                return false;
            }
            this.$refs.uToast.show({
                title: '提交成功',
                type: 'success',
                url: '/pages/index'
            });
        }
    }
};
</script>

<style lang="scss">
.wo-page-body {
    background-color: #fff;
    border-radius: uni-unit(10px);
    &::after {
        border-radius: uni-unit(10px);
    }
}
</style>
